<template>
	<!-- 量化分级-星级展示-企业风采展示 -->
	<view class="">
		<mescroll-uni :top="top" :bottom="bottom" ref="mescrollRef" @init="mescrollInit" :down="downOption"
			@down="downCallback" :up="upOption" @up="upCallback">
			<view class="section">
				<view class="img-bar">
					<view class="img-item" v-for="(item, index) in companyList" :key="index"
						@click="toDetail('fczs', item.id)">
						<image :src="item.images" mode=""></image>
						<view class="title common-text">{{item.name}}</view>
					</view>
				</view>
			</view>
		</mescroll-uni>
	</view>
</template>

<script>
	import config from "@/app.config.js";
	import DEMO_COMPANY from "@/data/demoCompany.js";
	import DEMO_PDGS from "@/data/demoPdgs.js";
	
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	
	export default {
		mixins: [MescrollMixin], // 下拉刷新和上拉加载的组件
		data() {
			return {
				keyword: '',
				
				companyList: [], // 企业风采展示
				
				top: 0,
				bottom: 0,
				downOption: {
					auto: false, //是否在初始化后,自动执行上拉回调callback; 默认true
				},
				upOption: {
					auto: true, //是否在初始化后,自动执行上拉回调callback; 默认true
					page: {
						num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
						size: 5 // 每页数据的数量
					},
					noMoreSize: 3, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看
					textNoMore: '~ 没有更多数据 ~',
					empty: {
						tip: '~ 搜索无结果 ~', // 提示
						btnText: ''
					}
				},
			}
		},
		onLoad(options = {}) {
			this.initPage(options);
		},
		methods: {
			initPage(options) {
				
			},
			pageTo(path) {
				vk.navigateTo(path);
			},
			search(data){
				this.keyword = data.keyword;
				vk.toast('搜索关键字 = ' + this.keyword);
			},
			toDetail(nav, id){
				let obj = this.companyList.find(item => item.id == id);
				this.$tools.pageTo('./detail', obj);
			},
			// 读取企业列表
			upCallback(page) {
				let start = (page.num - 1) * page.size;
				let end = page.num * page.size;
				let totalSize = DEMO_COMPANY.length;
				console.log('==page==', start, end);
				
				let pageList = DEMO_COMPANY.filter((item, index) => index>=start && index<end) || [];
				
				if (page.num == 1) this.companyList = []; //如果是第一页需手动置空列表
				this.companyList = this.companyList.concat(pageList); //追加新数据
				
				//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
				//方法二(推荐): 后台接口有返回列表的总数据量 totalSize
				this.mescroll.endBySize(pageList.length, totalSize); //必传参数(当前页的数据个数, 总数据量)
			},
		},
		// 监听器
		watch: {

		},
		// 计算属性
		computed: {

		},
		// 监听 - 页面下拉刷新
		onPullDownRefresh() {
			setTimeout(() => {
				this.initPage();
				uni.stopPullDownRefresh();
			}, 1000);
		},
	}
</script>

<style lang="scss">
	.img-bar{
		margin: auto;
		width: 90%;
	}
</style>